ul,
ol {
  list-style: none;
}

a {
  text-decoration: none;
}

a:hover {
  color: red;
}

body {
  background: url(../img/background.png);
}

#full {
  width: 400px;
  margin: 100px auto;
  background-color: #f4f8f9;
}

#header {
  width: 350px;
  height: auto;
  margin: 0 auto;
  padding: 30px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

#header h1 {
  margin-bottom: 25px;
  font-weight: 400;
  transform: scale(1.1);
  text-align: center;
}

#header h2 {
  font-weight: 400;
}

#body {
  width: 350px;
  height: auto;
  margin: 0 auto;
  position: relative;
}

#body .body-phone button {
  font-size: 15px;
}

#body ul {
  width: 350px;
  display: flex;
  margin: 0 auto;
  margin-bottom: 10px;
  border-bottom: 3px solid #e4e7ed;
}

#body ul li {
  height: 50px;
  width: 175px;
  color: #409eff;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

#body ul li:hover {
  color: #66b1ff;
}

#body .long {
  width: 50%;
  height: 4px;
  background-color: #409eff;
  position: absolute;
  transform: translateY(-13px);
}

.body-phone {
  display: none;
}

.body-password,
.body-phone {
  transform: translateX(15px);
}

.body-password input,
.body-phone input {
  width: 350px;
  height: 40px;
  padding-left: 25px;
  margin-top: -20px;
}

.body-password .btn-info,
.body-phone .btn-info {
  width: 350px;
  height: 40px;
  font-size: 16px;
}

.account,
.phonenum {
  position: relative;
}

.account span,
.phonenum span {
  position: absolute;
  top: 10px;
  right: 40px;
  color: #ccc;
}

.forget {
  font-size: 15px;
  display: flex;
  justify-content: space-between;
}

.forget p {
  color: #409eff;
  cursor: pointer;
}

.forget p:hover {
  color: #66b1ff;
}

.forget p a {
  color: #409eff;
}

.forget p a:hover {
  color: #66b1ff;
  text-decoration: none;
}

#foot {
  width: 350px;
  margin: 60px auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

#foot .QRCode {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 130px;
}

#foot img {
  width: 130px;
  height: 130px;
}

#bottom {
  width: 350px;
  margin: 0px auto;
}

#bottom P {
  width: 100%;
  display: flex;
  justify-content: center;
}

.warning {
  display: none;
  color: red;
}

.forgetPassword {
  display: none;
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(1, 1, 1, 0.5);
}

.information {
  margin-bottom: 25px;
}

.information small {
  margin-left: 100px;
}

.information label {
  float: left;
  margin-right: 20px;
}

.information sup {
  color: red;
  margin-right: 3px;
}

.information P {
  width: 80px;
  margin-top: 3px;
}

.information input {
  width: 75%;
  height: 40px;
}

.getit input {
  width: 50%;
  float: left;
}

.getit button {
  margin-left: 20px;
  height: 40px;
}

.modal-body .phonenum span {
  right: 60px;
}

.modal-body .glyphicon-ok,
.modal-body .glyphicon-remove {
  transform: translateY(-23px);
}
